/* Navbar hover effect */
.navbar-nav .nav-link {
    transition: all 0.3s ease;
    /* Smooth transition */
}

.navbar-nav .nav-link:hover {
    color: #fff !important;
    background-color: #284f6e;

    border-radius: 4px;
}

.heading {
    background-color: #284f6e;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('assets/images/logo33.jpg');
    /* Ensure correct asset path */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.1;
    /* Adjust this for transparency */
    z-index: 0;
    background-color: red;
    /* Ensure the overlay stays behind the content */
}

.select2-hidden-accessible+.select2-container--bootstrap4 .select2-selection {
    padding-right: 2.5em !important;
    /* Make space for clear button */
}

.select2-container--bootstrap4 .select2-selection__clear {
    background-color: black !important;
}

.select2-container--bootstrap4 .select2-selection__clear:hover {
    color: #dc3545;
    /* Optional: change color on hover (Bootstrap's danger red) */
}

td.wrap-text {
    white-space: normal !important;
    word-wrap: break-word;
    /* word-break: break-word; */
    max-width: 300px;
    /* Optional: Limit the column width */
}